<template>
	<view class="content">
		
		<view class='title_border'>
			<view class='nav_each'>
				<view class='nav_view' v-for='(item,index) in navList' @click='$goBack(item.path)'>
					<image class='nav_img' :src="item.src1" mode=""></image>
					<image class='nav_img nav_img_center' :src="item.src2" mode=""></image>
					<text class='nav_text'>{{item.label}}</text>
					<u-badge v-if="index==2" :type="type" max="999999" :value="value" :absolute='true'
						:offset="[-10,-10]">
					</u-badge>
				</view>
			</view>
		</view>
		<view class='title_border'>
			<view class='title_text'>
				<text class='title'>量化评估</text>
			</view>
			<view class='assess'>
				<view class='assess_left' @click="evaluation(1)">
					<text style='display:block;color:white;font-size:18px;'>企业</text>
					<text style='color:white;font-size:14px;'>量化评估</text>
					<image src="/static/index/assess2.png" mode="" class='assess_img'></image>
				</view>
				<view class='assess_right' @click="evaluation(2)">
					<text style='display:block;color:white;font-size:18px;'>人员</text>
					<text style='color:white;font-size:14px;'>量化评估</text>
					<image src="/static/index/assess1.png" mode="" class='assess_img'></image>
				</view>
			</view>
		</view>
		<view class='title_border'>
			<view style="border-bottom: 1px #F0F0F0 solid">
				<view class='title_text' style="width: 40%;display: inline-block;">
					<text class='title'>任务信息</text>
				</view>
				<view style="display: inline-block;width: 60%;text-align: right;">
					<text class="info_top_1" style="background: #C4E3FB;">待检查{{taskList.awaitInspCount}}</text>
					<text class="info_top_1" style="background: #FFE6B7;">已检查{{taskList.alreadyInspCount}}</text>
				</view>
			</view>
			<view class='info'>
				<!-- <view class='info_top'>
					<view class='info_each'>
						<text class='info_top_1' style='color:#0089FF'>{{taskList.alreadyInspCount}}</text>
						<text class='info_top_2'>已检查</text>
					</view>
					<view class='info_each'>
						<text class='info_top_1' style='color:#FF490F'>{{taskList.awaitInspCount}}</text>
						<text class='info_top_2'>待检查</text>
					</view>
				</view> -->
				<view class='info_task'>
					<!-- <u-subsection :list="list" fontSize='30' mode="subsection" :current="curNow"
						@change="sectionChange">
					</u-subsection> -->
					<view class='info_task_firm' v-for="item in inspList" @click="taskClick(item)">
						<view style='float:left;width: 70%;'>
							<text style='display:block;font-size: 28rpx;margin:8px 0;'>{{item.taskObjName}}</text>
							<text style='font-size:14px;color:#999999'>{{item.taskTypeName}}</text>
						</view>
						<view style='float:right;width: 30%;'>
							<text
								style='display:block;text-align:right;color:#0D91FF;margin:8px 0;'>{{item.taskStatusName}}</text>
							<text
								style="display:block;text-align:right;font-size: 28rpx;">{{item.taskTime.split(' ')[0]}}</text>
						</view>
						<view style='clear:both'></view>
					</view>

				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		warningMsgQuery,
	} from '@/common/api/req.js'
	import * as api from '@/common/api/notice.js'
	export default {
		data() {
			return {
				list4: [{
					url: '/static/index/banner.png',
					title: 'banner'
				}, ],
				// baseList: [],
				navList: [{
					src1: '/static/index/nav_bg1.png',
					src2: '/static/index/group1.png',
					label: '路检路查',
					path: '../roadCheck/roadCheck'
				}, {
					src1: '/static/index/nav_bg2.png',
					src2: '/static/index/group2.png',
					label: '车辆监管',
					path: '../carMonitor/carMonitor'
				}, {
					src1: '/static/index/nav_bg3.png',
					src2: '/static/index/group3.png',
					label: '预警信息',
					path: "../warning/msg_warning"
				}, {
					src1: '/static/index/nav_bg4.png',
					src2: '/static/index/group4.png',
					label: '信息查询',
					path: "../msgQuery/index"
				}, {
					src1: '/static/index/nav_bg5.png',
					src2: '/static/index/group5.png',
					label: '在线学习',
					path: "../onLineStudy/index"
				}, {
					src1: '/static/index/nav_bg6.png',
					src2: '/static/index/group6.png',
					label: '监督检查',
					path: "../notice/notice"
				}, {
					src1: '/static/index/nav_bg7.png',
					src2: '/static/index/group7.png',
					label: '监测分析',
					path: "../monitorAna/monitorAna"
				}, {
					src1: '/static/index/nav_bg8.png',
					src2: '/static/index/group8.png',
					label: '知识库',
					path: "../knowledge/knowledge_base",
					// path: "../knowledge/knowledge_base"
				}, ],
				// list: ['检查任务'],
				curNow: 0,
				type: "error",
				value: 0,
				taskList: [],
				inspList: []
			}
		},
		onLoad() {

		},
		mounted() {
			// 已检查/待检查
			api.default.getTaskStatistics()
				.then(res => {
					console.log(res)
					this.taskList = res.data.data
				})
				.catch(err => {
					console.log(err)
				})

			api.default.getInspPage({
					pages: 1,
					size: 99999
				})
				.then(rst => {
					console.log(rst)
					this.inspList = rst.data.data.records
				})
				.catch(err => {
					console.log(err)
				})

			warningMsgQuery({
					size: 10,
					current: 1,
					inspObjName: "",
					warningType: ""
				})
				.then(res => {
					console.log(res)
					this.value = res.data.data.total
				})
				.catch(err => {
					console.log(err)
				})

		},

		methods: {

			// 任务信息 检查任务和整改审核切换
			sectionChange(index) {
				this.curNow = index;
			},


			// 检查任务跳转
			taskClick(item) {
				// 例行检查
				if (item.taskType == '01') {
					this.$goBack('../supervision/routineCheck/recordMaintenance?taskId=' + item.taskId, 2);
				}
				// 监督检查
				if (item.taskType == '02') {
					this.$goBack('../supervision/hiddenDanger/recordMaintenance?taskId=' + item.taskId, 2);
				}
				// 专项整治
				if (item.taskType == '03') {
					this.$goBack('../supervision/specialRectification/recordMaintenance?taskId=' + item.taskId, 2);
				}
				// 重大节日
				if (item.taskType == '04') {
					this.$goBack('../supervision/securityControl/recordMaintenance?taskId=' + item.taskId, 2);
				}

			},

			evaluation(type) {
				if (type == 1) {
					this.$goBack('../enterpriseEvaluation/enterprise/checkInformation', 2);
				} else {
					this.$goBack('../enterpriseEvaluation/personnel/checkInformation', 2);
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 100%;
		height: 100%;

		.nav {
			width: 100%;
		}

		.title_border {
			border-bottom: 5px #f6f6f6 solid;

			.title_text {

				// border-bottom: 1px #F0F0F0 solid;
				padding: 20rpx 0;

				.title {
					border-left: 3px #1e8be7 solid;
					margin: 0 0 0 30rpx;
					padding: 0 20rpx;
					color: #1e8be7
				}
			}

			// 首页导航下的图片
			.nav_each {
				display: flex;
				justify-content: space-evenly;
				flex-wrap: wrap;
				margin: 10px 0;

				.nav_view {
					width: 23%;
					text-align: center;
					display: inline-block;
					position: relative;
					margin: 5px 0;

					.nav_img {
						width: 100rpx;
						height: 100rpx;
					}

					.nav_img_center {
						position: absolute;
						top: 13%;
						left: 50%;
						width: 50rpx;
						height: 50rpx;
						transform: translate(-50%, 0);
					}

					.nav_text {
						display: block;
						text-align: center;
						font-size: 14px;
						margin: 0 0 5px 0;
					}
				}

			}


			// 量化评估
			.assess {
				padding: 10px;
				display: flex;
				justify-content: space-evenly;

				.assess_left {
					border-radius: 15px;
					width: 40%;
					height: 90rpx;
					padding: 10px;
					background-color: #FFA012;
					position: relative;

				}

				.assess_right {
					border-radius: 15px;
					width: 40%;
					height: 90rpx;
					padding: 10px;
					background-color: #56ABFC;
					position: relative;
				}

				.assess_img {
					width: 35%;
					height: 60%;
					position: absolute;
					right: 10px;
					top: 15px;
				}

			}

			.info_top_1 {
				display: inline-block;
				padding: 10rpx 18rpx;
				border-radius: 4px;
				margin: 0 5px;
				font-size: 26rpx;
			}

			// 任务信息
			.info {
				// padding: 10px;
				// .info_top {
				// 	padding: 10px;
				// 	border: 1px #F0F0F0 solid;
				// 	border-radius: 5px;
				// 	height: 80rpx;
				// 	display: flex;
				// 	justify-content: space-evenly;

				// 	.info_each {
				// 		// border-right: 1px #F0F0F0 solid;
				// 		width: 24%;
				// 		display: inline-block
				// 	}

				// .info_top_1 {
				// 	display: block;
				// 	font-size: 18px;
				// 	line-height: 40rpx;
				// 	text-align: center;
				// 	margin: 0 0 5px 0;
				// }

				// 	.info_top_2 {
				// 		text-align: center;
				// 		display: block;
				// 	}
				// }

				.info_task {
					// border: 1px #F0F0F0 solid;
					border-radius: 5px;
					margin: 10px 0 0 0;

					// height: 260rpx;
					// overflow: hidden;
					.info_task_firm {
						padding: 10px;
						border-bottom: 1px #F0F0F0 solid;
					}

				}
			}



		}



	}
</style>